<template>
  <StudentLayout>
    <el-tabs v-model="activeName" class="demo-tabs">
      <el-tab-pane label="获取学生成绩" name="first">
        <el-select
          v-model="cour_name"
          placeholder="Select"
          size="large"
          style="width: 240px"
          :style="[{display:( $userStore.level > 2 ? 'none' : 'block')}]"
          @change="courNameChange"
        >
          <el-option
            v-for="item in teacherToCourseData"
            :key="item.cour_name"
            :label="item.label"
            :value="item.cour_name"
          />
        </el-select>
        <el-table :data="studentScoreData" style="width: 100%">
          <el-table-column prop="stu_id" label="学生学号" />
          <el-table-column prop="stu_name" label="学生姓名" />
          <el-table-column prop="stu_age" label="学生年龄" />
          <el-table-column prop="stu_gander" label="学生性别" />
          <el-table-column prop="stu_address" label="学生户籍" />
          <el-table-column prop="cour_id" label="课程编号" />
          <el-table-column prop="cour_name" label="课程名称" />
          <el-table-column prop="sco_score" label="课程分数" />
        </el-table>
      </el-tab-pane>
      <el-tab-pane label="获取最高分" name="second">
        <el-table :data="maxScoreData" style="width: 100%">
          <el-table-column prop="cour_id" label="课程编号" />
          <el-table-column prop="cour_name" label="课程名称" />
          <el-table-column prop="sco_score" label="课程最高分" />
        </el-table>
      </el-tab-pane>
    </el-tabs>
  </StudentLayout>
</template>
<script setup>
import StudentLayout from '@/layouts/StudentLayout.vue'
import  { getMaxScore, getStudentScore, getTeacherToCourseList } from '@/composables/school'

const { $userStore } = useNuxtApp()
const activeName = ref('first')
const cour_name = ref('')

const getCourAjax = () => {
  let params
  if ($userStore.level > 2) {
    params = {
      stu_name: $userStore.userName
    }
  } else {
    params = {
      cour_name: cour_name.value
    }
  }
  console.log(params, '----', $userStore.level)
  return getStudentScore(params).then(res => {
    let list = res.data
    return list
  })
}
const studentScoreData = ref()
const courNameChange = async () => {
  studentScoreData.value = await getCourAjax()
}
onMounted(() => {
  courNameChange()
})
// const {data: studentScoreData} = await useAsyncData('studentScore', async () => {
//   return await getCourAjax()
// })
const {data: maxScoreData} = await useAsyncData('maxScore', async () => {
  return await getMaxScore().then(res => {
    let list = res.data
    return list
  })
})
const {data: teacherToCourseData} = await useAsyncData('teacherToCourse', async () => {
  return await getTeacherToCourseList().then(res => {
    let list = res.data
    return list
  })
})
</script>
<style scoped>

</style>